import React from 'react';
import {  useOutlet,useNavigate } from 'react-router-dom';
import './App.css'

const App = () => {
  let navigate=useNavigate()
  let aa = useOutlet()

  return (
    <div className='body_1'>
      <div className='body_1_1'>
        {aa}
      </div>
      <div className='body_1_2'>
        <div className='body_1_2_1' onClick={()=>{navigate('/app/shouy')}}>
          <div className='body_1_2_1_1'>
            <img src='/首页.png' width='55%' />
          </div>
          <div className='body_1_2_1_2'>
            <span>首页</span>
          </div>
        </div>
        <div className='body_1_2_1' onClick={()=>{navigate('/app/xiaopao')}}>
          <div className='body_1_2_1_1'>
            <img src='/笔记.png' width='55%' />
          </div>
          <div className='body_1_2_1_2'>
            <span>校园跑</span>
          </div>
        </div>
        <div className='body_1_2_1' onClick={()=>{navigate('/app/xiaoxi')}}>
          <div className='body_1_2_1_1'>
            <img src='/消息.png' width='55%' />
          </div>
          <div className='body_1_2_1_2'>
            <span>消息</span>
          </div>
        </div>
        <div className='body_1_2_1' onClick={()=>{navigate('/app/my')}}>
          <div className='body_1_2_1_1'>
            <img src='/我的.png' width='55%' />
          </div>
          <div className='body_1_2_1_2'>
            <span>我的</span>
          </div>
        </div>
      </div>
    </div >
  )
}


export default App;
